<include file="public@header"/>
<style type="text/css">
</style>
</head>
<body>

<div class="wrap js-check-wrap">
    <blockquote class="layui-elem-quote layui-text">
        <p>系统用到的一些零散的参数配置</p>
    </blockquote>
    <ul class="nav nav-tabs">
        <li class="active"><a href="javascript:;">参数列表</a></li>
        <li><a href="{:url('AdminSystem/add')}">添加参数</a></li>
    </ul>
    <table class="layui-table"  lay-filter="test3">
        <thead>
        <tr>
            <th lay-data="{field:'id', width:80, sort: true}">ID</th>
            <th lay-data="{field:'username', width:120, sort: true, edit: 'text'}">参数描述</th>
            <th lay-data="{field:'email', edit: 'text', minWidth: 150}">字段名称</th>
            <th lay-data="{field:'sex', width:80, edit: 'text'}">值</th>
            <th lay-data="{field:'experience', sort: true, edit: 'text'}">操作</th>
        </tr>
        </thead>
        <foreach name="params" item="vo">
            <tr>
                <td>{$vo.id}</td>
                <td><b>{$vo.desc}</b></td>
                <td>{$vo.key_name}</td>
                <td>{$vo.value_name}</td>
                <td>
                    <a class="btn btn-xs btn-primary" 
                       href="{:url('AdminSystem/edit',['id'=>$vo['id']])}">修改</a>
                </td>
            </tr>
        </foreach>
    </table>
    <ul class="pagination">{$page|default=''}</ul>

    <script src="//res.layui.com/layui/dist/layui.js" charset="utf-8"></script>
    <!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
    <script>
        layui.use('table', function(){
            var table = layui.table;

            //监听单元格编辑
            table.on('edit(test3)', function(obj){
                var value = obj.value //得到修改后的值
                    ,data = obj.data //得到所在行所有键值
                    ,field = obj.field; //得到字段
                layer.msg('[ID: '+ data.id +'] ' + field + ' 字段更改为：'+ value);
            });
        });
    </script>
    
</div>
<script>
    layui.use('form', function(){
        var form = layui.form;

        //各种基于事件的操作，下面会有进一步介绍
    });
</script>
<script>
    layui.use('laydate', function() {
        var laydate = layui.laydate;

        //常规用法
        laydate.render({
            elem: '#test5',
            type: 'date',
            format: 'yyyy-MM-dd'
        });
    })
</script>
<script>

    layui.use(['form', 'layedit', 'laydate'], function(){
        var form = layui.form
            ,layer = layui.layer
            ,layedit = layui.layedit
            ,laydate = layui.laydate;

        //日期
        laydate.render({
            elem: '#date'
        });
        laydate.render({
            elem: '#date1'
        });

        //创建一个编辑器
        var editIndex = layedit.build('LAY_demo_editor');

        //自定义验证规则
        form.verify({
            role_id: function(value){
                if(value==0){
                    return '请选择角色等级';
                }
            }
        });

        //监听指定开关
        form.on('switch(switchTest)', function(data){
            layer.msg('开关checked：'+ (this.checked ? 'true' : 'false'), {
                offset: '6px'
            });
            layer.tips('温馨提示：请注意开关状态的文字可以随意定义，而不仅仅是ON|OFF', data.othis)
        });

        //监听提交
        form.on('submit(demo1)', function(data){
            layer.alert(JSON.stringify(data.field), {
                title: '最终的提交信息'
            })
            return false;
        });

        //表单赋值
        layui.$('#LAY-component-form-setval').on('click', function(){
            form.val('example', {
                "username": "贤心" // "name": "value"
                ,"password": "123456"
                ,"interest": 1
                ,"like[write]": true //复选框选中状态
                ,"close": true //开关状态
                ,"sex": "女"
                ,"desc": "我爱 layui"
            });
        });

        //表单取值
        layui.$('#LAY-component-form-getval').on('click', function(){
            var data = form.val('example');
            alert(JSON.stringify(data));
        });

    });
</script>
</body>
</html>
